<!DOCTYPE html>

<html>
  <head>
    <link rel='stylesheet' href='custombutton.css'>
    <link rel='stylesheet' href='toolbar.css'>
    <script src='ola.js'></script>
    <title>OLA Admin</title>
    <style type='text/css'>
      body {
        margin: 0px;
        padding: 0px;
        font-family: sans-serif;
        font-size: 13px;
      }

      table {
        font-family: sans-serif;
        font-size: 13px;
        padding: 0px;
        margin: 0px;
        border: 0px;
        border-spacing: 0px;
      }

      legend { font-weight: bold; }
      input { border: #e4e9fe 1px solid; }
      fieldset {
        border: #67a7e3 1px solid;
        margin-bottom: 5px;
      }

      pre {
        margin: 0px;
      }

      h2 {
        margin: 0px;
      }

      hr {
        border: #67a7e3 1px solid;
      }

      #header {
        margin: 0px;
        padding: 0px;
        left: 0px;
        text-align: left;
        font-size: 11px;
      }

      #right_nav {
        position: absolute;
        right: 0px;
        margin-right: 4px;
        text-align: right;
      }

      #footer {
        padding-top: 5px;
        text-align: center;
        clear: both;
        font-size: 11px;
      }

      .goog-control {
        cursor: pointer;
        outline: none;
      }

      .goog-inline-block {
        position: relative;
        display: -moz-inline-box; /* Ignored by FF3 and later. */
        display: inline-block;
      }

      .ola-scroller {
        width: 100%;
        height: 100%;
        overflow: auto;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -ms-box-sizing: border-box;
      }

      .ola-full-container {
        height: 100%;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -ms-box-sizing: border-box;
      }

      .ola-container {
        padding: 5px;
      }

      /* Log window css */
      .log_popup {
        position: absolute;
        visibility: hidden;
        font-size: 80%;
        -moz-outline: 0;
        outline: 0;
        z-index: 100;
      }

      .logdiv {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: scroll;
        overflow-x: hidden;
        overflow-y: scroll;
      }

      /* CSS for the dialog box */
      .modal-dialog {
        width: 430px;
        z-index: 101;
        background: #c1d9ff;
        border: 1px solid #3a5774;
        padding: 4px;
        position: absolute;
      }

      .modal-dialog-bg {
        background: #666;
        left: 0;
        position: absolute;
        top: 0;
      }

      .modal-dialog-title {
        background: #e0edfe;
        font-size: 120%;
        font-weight: bold;
        padding: 8px 15px 8px 8px;
        position: relative;
        _zoom: 1; /* Ensures proper width in IE6 RTL. */
      }

      .modal-dialog-buttons,
      .modal-dialog-content {
        background-color: #fff;
        padding: 8px;
      }

      /* Generic split pane styles */
      /* NOTE: A bug in Safari 3 requires these css definitions to be in here.
         Do not move these to a separate file without testing safari 3! */
      .goog-splitpane {
        width: 100%;
      }

      .goog-splitpane-handle-horizontal {
        cursor: col-resize;
      }

      /* CSS for the main split pane */
      .ola-splitpane-handle {
        border-left: 2px solid #67a7e3;
        border-right: 2px solid #67a7e3;
        position: absolute;
      }

      .ola-splitpane-navigation {
        font-size: 13px;
        overflow: auto;
        position: absolute;
        white-space: nowrap;
      }

      .ola-splitpane-content {
        border-top: 4px solid #67a7e3;
        border-bottom: 4px solid #67a7e3;
        border-right: 4px solid #67a7e3;
        position: absolute;
        overflow: hidden;
      }

      /* CSS for the navigation pane */
      .ola-splitpane-navigation .goog-control {
        padding: 2px 0px 2px 5px;
        color: #0066cc;
        background-color: #fff;
      }

      .ola-splitpane-navigation .goog-control-hover {
        background-color: #b3d3f7;
      }

      .ola-splitpane-navigation .goog-container {
        padding: 2px;
      }

      .ola-splitpane-navigation .goog-container .goog-control {
        overflow: hidden;
        padding-left: 17px;
      }

      .goog-zippy-expanded img {
        background-image: url('expander.png');
        background-position: 0px 0px;
      }
      .goog-zippy-collapsed img {
        background-image: url('expander.png');
        background-position: -40px 0px;
      }

      .goog-zippy-expanded { cursor: pointer; }
      .goog-zippy-collapsed { cursor: pointer; }

      .ola-splitpane-navigation img {
        width: 12px;
        height: 12px;
        padding-right: 5px;
      }

      /* CSS for the tabs */
      .goog-tabpane {
        position: relative;
        margin-left: 2px;
      }

      .goog-tabpane-tabs {
        outline: none;
        list-style: none;
        margin: 0px;
        padding: 0px;
        position: relative;
      }

      .goog-tabpane-tab, .goog-tabpane-tab-selected {
        display: block;
        background: #e3e9ff;
        border-right: 1px solid #67a7e3;
        margin: 0px;
        padding: 5px 10px;
        float: left;
        cursor: pointer;
      }

      .goog-tabpane-tab-selected {
        background: #bbccff;
      }

      .goog-tabpane-cont {
        border-top: #67a7e3 1px solid;
      }

      /* CSS for the RDM split pane */
      .ola-splitpane-rdm {
        border-top: 1px solid #67a7e3;
      }

      .ola-splitpane-rdm-handle {
        border-left: 2px solid #67a7e3;
        border-right: 2px solid #67a7e3;
        position: absolute;
      }

      .ola-splitpane-rdm-uids {
        overflow: auto;
      }

      .ola-splitpane-rdm-uids .goog-container {
        outline: none;
      }

      .ola-splitpane-rdm-uids .goog-container .goog-control {
        padding-left: 4px;
        white-space: nowrap;
      }

      /* Tables are used in various frames */
      .ola-table {
        width: 100%;
        border-bottom: 1px solid #e4e9fe;
      }

      .ola-table thead {
        text-align: left;
      }

      .ola-table td {
        border-top: 1px solid #e4e9fe;
      }

      /* Checkboxes are used in various frames */
      .goog-checkbox {
        border: 1px solid #1C5180;
        cursor: pointer;
        display: -moz-inline-box;
        display: inline-block;
        font-size: 1px;  /* Fixes the height in IE6 */
        height: 11px;
        margin: 0 4px 0 1px;
        vertical-align: text-bottom;
        width: 11px;
        outline: none;
      }

      .goog-checkbox-checked {
        background: #fff url('tick.gif') no-repeat 2px center;
      }

      .goog-checkbox-undetermined {
        background: #bbb url('tick.gif') no-repeat 2px center;
      }

      .goog-checkbox-unchecked {
        background: #fff;
      }

      .goog-checkbox-disabled {
        border: 1px solid lightgray;
        cursor: default !important;
        background-position: -7px;
      }

      /* menus are used in the main frame */
      .goog-menu-button {
        background: #ddd url(/button-bg.png) repeat-x top left;
        border: 0;
        color: #000;
        cursor: pointer;
        list-style: none;
        margin: 2px;
        outline: none;
        padding: 0;
        text-decoration: none;
        vertical-align: middle;
        font-size: 11px;
      }

      /* Pseudo-rounded corners. */
      .goog-menu-button-outer-box,
      .goog-menu-button-inner-box {
        border-style: solid;
        border-color: #aaa;
        vertical-align: top;
      }
      .goog-menu-button-outer-box {
        margin: 0;
        border-width: 1px 0;
        padding: 0;
      }
      .goog-menu-button-inner-box {
        margin: 0 -1px;
        border-width: 0 1px;
        padding: 3px 4px;
      }

      /* Pre-IE7 IE hack; ignored by IE7 and all non-IE browsers. */
      * html .goog-menu-button-inner-box {
        /* IE6 needs to have the box shifted to make the borders line up. */
        left: -1px;
      }

      /* Pre-IE7 BiDi fixes. */
      * html .goog-menu-button-rtl .goog-menu-button-outer-box {
        /* @noflip */ left: -1px;
        /* @noflip */ right: auto;
      }
      * html .goog-menu-button-rtl .goog-menu-button-inner-box {
        /* @noflip */ right: auto;
      }

      /* IE7-only hack; ignored by all other browsers. */
      *:first-child+html .goog-menu-button-inner-box {
        /* IE7 needs to have the box shifted to make the borders line up. */
        left: -1px;
      }
      /* IE7 BiDi fix. */
      *:first-child+html .goog-menu-button-rtl .goog-menu-button-inner-box {
        /* @noflip */ left: 1px;
        /* @noflip */ right: auto;
      }

      /* Safari-only hacks. */
      ::root .goog-menu-button,
      ::root .goog-menu-button-outer-box,
      ::root .goog-menu-button-inner-box {
        /* Required to make pseudo-rounded corners work on Safari. */
        line-height: 0;
      }
      ::root .goog-menu-button-caption,
      ::root .goog-menu-button-dropdown {
        /* Required to make pseudo-rounded corners work on Safari. */
        line-height: normal;
      }

      /* State: hover. */
      .goog-menu-button-hover .goog-menu-button-outer-box,
      .goog-menu-button-hover .goog-menu-button-inner-box {
        border-color: #9cf #69e #69e #7af !important; /* Hover border wins. */
      }

      /* State: active, open. */
      .goog-menu-button-active,
      .goog-menu-button-open {
        background-color: #bbb;
        background-position: bottom left;
      }

      /* State: focused. */
      .goog-menu-button-focused .goog-menu-button-outer-box,
      .goog-menu-button-focused .goog-menu-button-inner-box {
        border-color: orange;
      }

      .goog-menu-button-caption {
        padding: 0 4px 0 0;
        vertical-align: top;
      }

      .goog-menu-button-dropdown {
        height: 13px;
        width: 7px;
        background: url('expander.png') no-repeat -73px 0;
        vertical-align: top;
      }

      .goog-menu {
        background: #fff;
        border-color: #ccc #666 #666 #ccc;
        border-style: solid;
        border-width: 1px;
        cursor: default;
        font: normal 11px Arial, sans-serif;
        margin: 0;
        outline: none;
        padding: 4px 0;
        position: absolute;
        z-index: 20000;
      }

      .goog-menuitem {
        color: #000;
        list-style: none;
        margin: 0;
        padding: 4px 7em 4px 10px;
        white-space: nowrap;
      }

      .goog-menuitem-content {
        color: #000;
      }

      .goog-menuitem-highlight,
      .goog-menuitem-hover {
        background-color: #d6e9f8;
        /* Use an explicit top and bottom border so that the selection is visible
         * in high contrast mode. */
        border-color: #d6e9f8;
        border-style: dotted;
        border-width: 1px 0;
        padding-bottom: 3px;
        padding-top: 3px;
      }

      /* slider styles */
      .goog-slider-vertical {
        background-image: url('vertical.gif');
        position: relative;
        overflow: hidden;
        outline: none;
        width: 23px;
        height: 200px;
      }

      .goog-slider-thumb {
        position: absolute;
        background-image: url('handle.vertical.png');
        overflow: hidden;
      }

      .goog-slider-vertical .goog-slider-thumb {
        left: 4px;
        height: 31px;
        width: 15px;
      }

      /* styles for the dmx console */
      #console_table {
        border: 1px solid #67a7e3;
        float:left;
      }

      #console_value_row td {
        border-top: #67a7e3 solid 1px;
        font-size: 11px;
        text-align: center;
      }

      #console_channel_row td {
        font-size: 11px;
        text-align: center;
      }

      #channel_values {
        overflow-y: auto;
      }

      #channel_values div {
        display: inline-block;
        font-size: 11px;
        border-bottom: 1px solid #67a7e3;
        border-right: 1px solid #67a7e3;
        width: 20px;
        text-align: center;
        margin: 1px;
      }

      /* The full monitor view */
      .monitor_full > div {
        display: inline-block;
        border-bottom: 1px solid #67a7e3;
        border-right: 1px solid #67a7e3;
        width: 34px;
        height: 34px;
        position: relative;
      }

      .monitor_full div div {
        text-align: left;
        padding-left: 2px;
        font-size: 11px;
        color: #666666;
        background-color: #eaffff;
      }

      .monitor_full div span {
         position: absolute;
         width: 100%;
         bottom: 0;
         font-size: 14px;
         text-align: center;
      }

      /* The compact monitor view */
      .monitor_compact > div {
        display: inline-block;
        border-bottom: 1px solid #67a7e3;
        border-right: 1px solid #67a7e3;
        width: 20px;
        height: 20px;
      }

      .monitor_compact div div {
         display: none;
      }

      .monitor_compact div span {
         font-size: 11px;
         text-align: center;
         display: block;
         line-height: 20px;
      }

      .ola-icon {
        height: 16px;
        width: 16px;
        background-image: url(/toolbar_sprites.png);
        background-color: transparent;
        background-repeat: no-repeat;
        position: relative;
        display: -moz-inline-box; /* Ignored by FF3 and later. */
        display: inline-block;
        margin: 0px 2px 0px 2px;
      }

      .ola-icon-prev { background-position: -0px -0px; }
      .ola-icon-discovery { background-position: -16px -0px; }
      .ola-icon-next { background-position: -32px -0px; }
      .ola-icon-full { background-position: -48px -0px; }
      .ola-icon-hide { background-position: -64px -0px; }
      .ola-icon-incremental { background-position: -80px -0px; }
      .ola-icon-dbo { background-position: -96px -0px; }
      .ola-icon-refresh { background-position: -112px -0px; }
      .ola-icon-patch { background-position: -128px -0px; }
      .ola-icon-show { background-position: -144px -0px; }

      /* patcher styles */
      .patcher { position: relative; left: 0px; top: 0px; }
      .patch_row { position: relative; }

      .patcher_table {
        width: 100%;
        position: absolute;
        top: 1px;
        left: 0px;
        border-collapse: collapse;
      }

      .patcher_table td {
        border: #333333 1px solid;
        padding: 0px;
        width: 12.5%;
      }

      .content_table {
        width: 100%;
        position: absolute;
        top: 1px;
        left: 0px;
        border-collapse:collapse;
        border-right: #333333 1px solid;
        table-layout: fixed;
      }

      .content_table td {
        padding: 0px;
      }

      .patcher_title {
        text-align: left;
        width: 12.5%;
        font-size: 10px;
        border-left: #333333 1px solid;
      }

      .patcher_occupied_cell {
        border-left: #333333 1px solid;
        font-size: 11px;
      }

      .patcher_occupied_cell div {
        overflow: hidden;
        height: 12px;
        margin: 1px;
        cursor: pointer;
      }

      .patcher_device {
        background-color: #c1d9ff;
      }

      .patcher_overflow_device {
        background-color: #e78978;
      }

      #patcher_status {
        font-size: 11px;
        background-color: #efefef;
        height: 14px;
        border-top: 1px solid #d5d5d5;
        padding-top: 2px;
      }

      .draggable_device {
        position: absolute;
        overflow: hidden;
        height: 12px;
        background-color: #c1d9ff;
        margin: 1px;
        cursor: pointer;
        font-size: 11px;
      }

      /* plugin frame styles */
      .plugin_enabled {
        font-color: #ffffff;
        background-color: #00ff00;
      }

      .plugin_disabled {
        background-color: #ff0000;
        font-color: #ffffff;
      }

      #plugin_state_table { padding: 4px; }
      #plugin_state_table td { padding: 4px; }
      #plugin_preference_source { font-family: monospace; }

      #plugin_description {
        font-family: monospace;
        white-space: pre-wrap;
      }

      #plugin_conflict_list .goog-control {
        margin-right: 3px;
        outline: none;
        color: #0066cc;
        display: inline-block;
      }

      #plugin_conflict_list .goog-control-hover {
        text-decoration: underline;
      }
    </style>
  </head>
  <body onload='ola.Setup()'>
    <div id='header'>
      <div id='right_nav'><span id='log_control'>View Log</span></div>
      <div id='title'>
       <img src='logo.png' width='111' height='48' alt='Logo'>
      </div>
    </div>

    <div id='log_popup' class='log_popup'>
      <div id='log' style='border: 1px solid #000000'></div>
    </div>

    <div class='goog-splitpane' id='split_pane' style='visibility: hidden'>
      <div class='goog-splitpane-handle ola-splitpane-handle'></div>
      <div class='goog-splitpane-first-container ola-splitpane-navigation'>
       <div id='home_control' class='goog-control'
         title='Main page'>
         <img src='blank.gif'>Home
       </div>
       <div id='universe_list_control' class='goog-control'
         title='Click to show/hide active universes'>
         <img src='blank.gif'>Universes
       </div>
       <div id='universe_container' class='goog-container'></div>
       <div id='plugin_list_control' class='goog-control'
         title='Click to show/hide plugins'>
         <img src='blank.gif'>Plugins
       </div>
       <div id='plugin_container' class='goog-container'></div>
      </div>

      <div class='goog-splitpane-second-container ola-splitpane-content'
          id='ola-splitpane-content'>
        <div class='ola-scroller ola-container' id='home_frame' style=''>
          <fieldset>
            <legend>Active Universes</legend>
            <table class='ola-table'>
             <thead>
              <tr>
               <th>Universe #</th>
               <th>Universe Name</th>
               <th>Input Ports</th>
               <th>Output Ports</th>
               <th>RDM Devices</th>
              </tr>
             </thead>
             <tbody id='active_universe_list'>
             </tbody>
           </table>
          </fieldset>

          <div style='text-align: center'>
           <div id='new_universe_button'
             class='goog-custom-button goog-inline-block'
             title='Setup a new universe'>Add Universe</div>
          </div>
          <fieldset>
            <legend>Server Info</legend>
            <table>
             <tr>
              <td>Hostname</td>
              <td><div id='server_hostname'></div></td>
             </tr>
             <tr>
              <td>Primary IP</td>
              <td><div id='server_ip'></div></td>
             </tr>
             <tr>
              <td style='padding-right: 10px'>Primary Broadcast Address</td>
              <td><div id='server_broadcast'></div></td>
             </tr>
             <tr>
              <td>Primary MAC Address</td>
              <td><div id='server_mac'></div></td>
             </tr>
             <tr>
              <td>Instance Name</td><td><div id='server_instance_name'></div></td>
             </tr>
             <tr>
              <td>Version</td><td><div id='server_version'></div></td>
             </tr>
             <tr>
              <td>Started</td><td><div id='server_uptime'></div></td>
             </tr>
           </table>
          </fieldset>
          <div style='text-align: center'>
           <div id='reload_button' class='goog-custom-button goog-inline-block'
             title='Reload all plugins'>
             Reload Plugins
           </div>
           <div id='stop_button' class='goog-custom-button goog-inline-block'
             title='Stop OLA'>Stop OLA</div>
          </div>
          <br>
        </div>

        <div id='new_universe_frame' class='ola-scroller ola-container'>
          <fieldset>
           <legend>New Universe Settings</legend>
           <table>
            <tr>
             <td>Universe Id</td>
             <td><input id='new_universe_id' maxlength='200'></td>
            </tr>
            <tr>
             <td>Universe Name</td><td><input id='new_universe_name'></td>
            </tr>
           </table>
          </fieldset>
          <fieldset>
            <legend>Available Ports</legend>
            <table class='ola-table'>
             <thead>
              <tr>
               <th>&nbsp;</th>
               <th>Device</th>
               <th>Direction</th>
               <th>Description</th>
              </tr>
             </thead>
             <tbody id='available_ports'>
             </tbody>
           </table>
          </fieldset>
          <div style='text-align: center'>
           <div id='cancel_new_universe_button'
             class='goog-custom-button goog-inline-block'
             title='Go back'>Cancel</div>
           <div id='confirm_new_universe_button'
             class='goog-custom-button goog-inline-block'
             title='Setup a new universe'>Add Universe</div>
          </div>
        </div>

        <div id='universe_frame'>
          <div id='universe_frame_tab_pane'></div>

          <div id='tab_page_1' class='ola-scroller ola-container'>
            <fieldset>
             <legend>Universe Settings</legend>
             <table>
              <tr>
               <td>Universe Id</td><td><div id='universe_id'></div></td>
              </tr>
              <tr>
               <td>Universe Name</td>
               <td><input id='universe_name' maxlength='200'></td>
              </tr>
              <tr>
               <td>Merge Mode</td>
               <td>
                 <div id='universe_merge_mode' class='goog-select'>
                   <ul class='goog-menu'>
                    <li class='goog-menuitem'>HTP</li>
                    <li class='goog-menuitem'>LTP</li>
                   </ul>
                 </div>
               </td>
              </tr>
             </table>
            </fieldset>
            <fieldset>
              <legend>Input Ports</legend>
                <table class='ola-table'>
                 <thead>
                  <tr>
                   <th width='30px'>&nbsp;</th>
                   <th width='40%'>Device</th>
                   <th width='30%'>Description</th>
                   <th width='30%'>Priority</th>
                  </tr>
                 </thead>
                 <tbody id='input_ports'>
                 </tbody>
               </table>
            </fieldset>
            <fieldset>
              <legend>Output Ports</legend>
              <table class='ola-table'>
               <thead>
                <tr>
                 <th width='30px'>&nbsp;</th>
                 <th width='40%'>Device</th>
                 <th width='30%'>Description</th>
                 <th width='30%'>Priority</th>
                </tr>
               </thead>
               <tbody id='output_ports'>
               </tbody>
             </table>
            </fieldset>
            <fieldset>
              <legend id='additional_ports_expander'>
                <img style='width: 12px; height: 12px' src='blank.gif'>
                Add Additional Ports</legend>
              <table class='ola-table' id='additional_ports'>
               <thead>
                <tr>
                 <th>&nbsp;</th>
                 <th>Device</th>
                 <th>Direction</th>
                 <th>Description</th>
                </tr>
               </thead>
               <tbody id='universe_available_ports'>
               </tbody>
             </table>
            </fieldset>
            <div style='text-align: center'>
             <div id='universe_save_button'
               class='goog-custom-button goog-inline-block'
               title='Save Changes'>Save</div>
            </div>
            <br/>
          </div>

          <div id='tab_page_2'>
            <div id='rdm_toolbar' class='goog-toolbar'>
              <div id='discoveryButton' class='goog-toolbar-button'>
                <div class='ola-icon ola-icon-discovery'></div>
              </div>
              <div id='incrementalDiscoveryButton' class='goog-toolbar-button'>
                <div class='ola-icon ola-icon-incremental'></div>
              </div>
              <hr>
              <div id='showAllSectionsButton' class='goog-toolbar-button'>
                <div class='ola-icon ola-icon-show'></div>
              </div>
              <div id='hideAllSectionsButton' class='goog-toolbar-button'>
                <div class='ola-icon ola-icon-hide'></div>
              </div>
              <hr>
              <div id='refreshButton' class='goog-toolbar-menu-button'>
                <span class='ola-icon ola-icon-refresh'>&nbsp;</span>
                Refresh
                <div id='decoratedMenu' class='goog-menu'>
                  <div class='goog-menuitem'>Never</div>
                  <div class='goog-menuitem'>30s</div>
                  <div class='goog-menuitem'>1m</div>
                  <div class='goog-menuitem'>5m</div>
                </div>
              </div>
            </div>
            <div class='goog-splitpane ola-splitpane-rdm' id='rdm_split_pane'>
              <div class='goog-splitpane-first-container
                          ola-splitpane-rdm-uids'>
               <div id='uid_container' class='goog-container'></div>
              </div>
              <div class='goog-splitpane-second-container
                          ola-splitpane-rdm-device'>
                <div id='rdm_attributes' class='ola-scroller ola-container'>
                </div>
              </div>
              <div class='goog-splitpane-handle ola-splitpane-rdm-handle'></div>
            </div>
          </div>
          <div id='tab_page_3'>
            <div id='patcher_toolbar' class='goog-toolbar'>
              <div id='autoPatchButton' class='goog-toolbar-button'>
                <div class='ola-icon ola-icon-patch'></div>
              </div>
              <div id='patcherRefreshButton' class='goog-toolbar-button'>
                <div class='ola-icon ola-icon-refresh'></div>
              </div>
            </div>
            <div id="patcher_div" class='ola-scroller patcher'></div>
            <div id="patcher_status"></div>
          </div>
          <div id='tab_page_4'>
            <div id='monitor_toolbar' class='goog-toolbar'>
              <div id='monitor_view_button' class='goog-toolbar-menu-button'>
                View
                <div id='decoratedMenu' class='goog-menu'>
                  <div class='goog-menuitem'>Full</div>
                  <div class='goog-menuitem'>Compact</div>
                </div>
              </div>
            </div>
            <div class="ola-full-container" style="padding-bottom: 30px">
             <div class="ola-scroller">
              <div id='monitor_values' class="monitor_full"></div>
             </div>
            </div>
          </div>
          <div id='tab_page_5' class='ola-scroller'>
            <div id='console_toolbar' class='goog-toolbar'></div>
            <table cellspacing='0' cellpadding='0' id='console_table'>
             <tbody>
              <tr id='console_channel_row'></tr>
              <tr id='console_value_row'></tr>
              <tr id='console_slider_row'></tr>
             </tbody>
            </table>
            <div id='channel_values'></div>
          </div>
        </div>
        <div class='ola-scroller ola-container' id='plugin_frame'>
          <h2 id="plugin_name"></h2>
          <table id="plugin_state_table">
           <tr>
            <td>Config Location</td>
            <td><span id="plugin_preference_source"></span></td>
           </tr>
           <tr>
            <td>Enabled in Config File</td>
            <td><span id="plugin_enabled"></span></td>
           </tr>
           <tr>
            <td>Active</td>
            <td><span id="plugin_active"></span></td>
           </tr>
           <tr id='plugin_conflict_row'>
            <td style="vertical-align: top">Conflicts with</td>
            <td><div id="plugin_conflict_list"></div></td>
           </tr>
         </table>
         <hr/>
         <div id='plugin_description'></div>
        </div>
      </div>
    </div>
    <noscript>
      <br>
      <p align="center">
        <strong>This interface requires JavaScript to function. If you
          would like to use it, please enable JavaScript and reload
          the page.</strong>
      </p>
      <br>
    </noscript>

    <div id='footer'>
      OLA &copy; 2005-2019 Open Lighting Project<br>
      <a href="mobile.html">Mobile Version</a> - <a href="new/">New UI (Beta)</a>
    </div>
  </body>
</html>
